<template>
    <!-- 分页练习 -->
 <!-- <pagingCom></pagingCom> -->
 <h1>APP</h1>
 <breadCrumb :data="data"></breadCrumb>
 <router-view></router-view>

</template>
<script setup>
import pagingCom from "./components/分页的应用.vue"
import {onMounted, ref,getCurrentInstance} from "vue"
let data = ref("")

onMounted(()=>{
    // 通过 getCurrentInstance 方法获取当前组件实例，从而获取 route 和 router
    // console.log(getCurrentInstance());//appContext=>config=>globalProperties=>($bus)
    let instance = getCurrentInstance()
    // console.log(instance);

    // 获得app全局添加的属性
    let $bus = instance.appContext.config.globalProperties.$bus

    // 总线传参，App.vue和guard之间传递面包屑的数据
    // on 监听事件
    // input接收面包屑的数据
    $bus.$on('breadChange',input=>{
        console.log(input);
        // 父子传参，App.vue和breadCrumb传递面包屑的数据
        data.value = input;
    })

})

</script>
